<template>
    <div>
        <img class="el-upload-list__item-thumbnail" :src="src" alt="">
    </div>
</template>

<script>
    import Tiff from 'tiff.js';
    export default {
        name: "thumbnail",
        props: {
            file: { type: Object, required: true },
        },
        data() {
            return {
                src: ''
            };
        },
        mounted () {

        },
        created() {

                // 判断是不是tif数据格式，如果是，则试用tif.js处理

            try {
                let isTif = ['image/tiff', 'image/tif'].includes(this.file.raw.type);
                if (isTif) {
                    var xhr = new XMLHttpRequest();
                    xhr.responseType = 'arraybuffer';
                    xhr.open('GET', this.file.url);
                    xhr.onload = (e) => {
                        var tiff = new Tiff({ buffer: xhr.response });
                        var canvas = tiff.toCanvas();
                        this.src = canvas.toDataURL();
                    };
                    xhr.send();
                } else {
                    this.src = this.file.url;
                }
            }catch (e) {
                this.src = this.file.url;
            }


        },


    };

</script>
